<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <div th:replace="common/header::head"></div>
</head>
<body>
<div th:replace="common/header::headerhtml"></div>
<div class="layui-container fly-marginTop">
    <div class="fly-panel fly-panel-user" pad20>
        <div class="layui-tab layui-tab-brief" lay-filter="user">
            <ul class="layui-tab-title">
                <li class="layui-this">登入</li>
                <li><a href="/page/reg/">注册</a></li>
            </ul>
            <div class="layui-form layui-tab-content" id="LAY_ucm" style="padding: 20px 0;">
                <div class="layui-tab-item layui-show">
                    <div class="layui-form layui-form-pane">
                        <form method="post" lay-filter="example">
                            <div class="layui-form-item"><input type="hidden" name="secret"
                                                                value="%E9%98%B2%E6%AD%A2%E5%B9%BF%E5%91%8A%E7%8B%97452214">
                                <label for="L_email" class="layui-form-label">账号</label>
                                <div class="layui-input-inline">
                                    <input type="text" id="L_loginName" name="account"
                                           required lay-verify="required" autocomplete="off"
                                           class="layui-input">
                                </div>
                                <!-- <div class="layui-form-mid layui-word-aux"> 使用手机或者邮箱中的任意一个均可（若采用手机，请确保你的帐号已绑定过该手机）</div>-->
                            </div>
                            <div class="layui-form-item"><label for="L_pass" class="layui-form-label">密码</label>
                                <div class="layui-input-inline">
                                    <input type="password" id="L_pass" name="pass"
                                           required lay-verify="required" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item"><label for="L_vercode" class="layui-form-label">图形码</label>
                                <div class="layui-input-inline"><input type="text" id="L_imagecode" name="code"
                                                                       required lay-verify="required" autocomplete="off"
                                                                       class="layui-input"></div>
                                <div class="layui-form-mid" style="padding: 0!important;"><img
                                        src="/comm/code?t=0" class="fly-imagecode"
                                        onclick="this.src = '/comm/code?t='+Math.random()"/>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn" lay-filter="login" lay-submit="">立即登录</button>
                                <span style="padding-left:20px;"> <a style="color: #9c9494;" href="javascript:;">忘记密码？</a> </span></div>
                            <!--<div class="layui-form-item fly-form-app"><span>或者使用社交账号登入</span> <a href="/app/qq"
                                                                                                 onclick="layer.msg('正在通过QQ登入', {icon:16, shade: 0.1, time:0})"
                                                                                                 class="iconfont icon-qq"
                                                                                                 title="QQ登入"></a> <a
                                    href="/app/weibo/" onclick="layer.msg('正在通过微博登入', {icon:16, shade: 0.1, time:0})"
                                    class="iconfont icon-weibo" title="微博登入"></a></div>-->
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div th:replace="common/footer::footer"></div>
<script th:replace="common/footer::script"></script>
<script th:src="@{/js/common/header.js}"></script>
<script>
    layui.config({
        base: '/layui/modules/'
    }).extend({
        md5: 'md5'
    });
    layui.use(["form", "md5"], function () {
        var $ = layui.jquery,
            form = layui.form,
            md5 = layui.md5;

        /**这个里面有个问题，一旦出现异常，页面直接被刷新。这样导致无法判断问题点。**/
        form.on('submit(login)', function (res) {
            var data = res.field;
            try {
                /**数据处理及验证放在这里面**/

                data.pass = md5.calcMD5(data.pass);
            } catch (err) {
                console.log(err.message);
                return false;
            }

            $.ajax({
                url: '/login/login',
                type: 'post',
                dataType: 'json',
                data: data,
                success: function (result) {
                    if (result.status !== 200) {
                        layer.alert(result.msg);
                        return false;
                    }
                    //跳转
                    location.href = '/page/task';
                }
            });
            return false;
        });
    })


</script>

</body>
</html>